<template>
  <pro-config-provide :config="config">
    <div>
      <pro-global-tooltip />
      <Index v-if="!page && ready" />
      <Chart v-if="page === 'chart' && ready" />
      <CascaderForm v-if=" page === 'cascader-form' && ready" />
      <ChartG6 v-if=" page === 'chart-g6' && ready" />
      <Dev v-if=" page === 'dev' && ready" />
      <DemoG2Plot  v-if=" page === 'plot' && ready"/>
    </div>
  </pro-config-provide>
</template>

<script>
import Vue from "vue";
import { getComponentByUrl } from "../components/async-chunk/import-call";
import { get, post, postForm } from "mars-pro/src/pro/request";
import Index from "./index.vue";
import Design from "./design.vue";
import Chart from "./chart.vue";
import CascaderForm from "./cascader-form.vue";
import Dev from "./dev.vue";
import ChartG6 from "./chart-g6.vue";
import DemoG2Plot from "./g2plot";

export default {
  mixins: [],
  components: {
    Index,
    Design,
    Dev,
    Chart,
    CascaderForm,
    ChartG6,
    DemoG2Plot
  },
  created() {},
  data() {
    return {
      ready: false,
      page: null,
      input: "Hello Element UI!",
      httpResponse: "",
      httpResponse1: "",
      httpResponse2: "",
      config: {
        menuData: [],
        dictData: {
          STATIC_DICT_TABLE_SELECT_LIST: {
            list: Array.from({ length: 10 }).map((r, index) => ({
              label: "选项" + index,
              value: index,
              remark: "备注信息",
            })),
            total: 100,
          },
          YES_OR_NOT: [
            { name: "是", code: "1" },
            { name: "否", code: "2" },
            { name: "不确定", code: "3" },
            { name: "未知", code: "4" },
          ],
          SEX: [
            { name: "男", code: "1" },
            { name: "女", code: "2" },
          ],
          system: {
            YES_OR_NOT: [
              { name: "是-系统", code: "1" },
              { name: "否-系统", code: "2" },
              { name: "不确定", code: "3" },
              { name: "未知", code: "4" },
            ],
          },
          STATIC_SELECT_LIST: Array.from({ length: 15 }).map((r, index) => ({
            label: "选项" + index,
            value: index,
          })),
          STATIC_DICT_SELECT_GROUPLIST: Array.from({ length: 12 }).map(
            (r, index) => ({
              sex: index > 4 ? "男" : "女",
              label: "选项" + index,
              value: index,
            })
          ),
          STATIC_DICT_SELECT_TREE: Array.from({ length: 4 }).map(
            (r, index) => ({
              value: `${index}`,
              label: "节点-" + index,
              leaf: false,
              children: Array.from({ length: 3 }).map((r, j) => ({
                value: `${index}-${j}`,
                label: "节点-" + index + "-" + j,
                leaf: true,
              })),
            })
          ),
        },
        dictFieldMap: { label: "name", value: "code" },
        getDataByDictType: null,
        //detailModel--label命名规范
        getLabelPropFromDetailModel: (prop) => prop + "AsText",

        authorityData: {},
        useInfoData: {},
        getComponentByUrl: getComponentByUrl,
        api: {
          totalField: "total",
          pageSizeField: "pageSize",
          currentPageField: "currentPage",
          dataField: "",
          singleQueryField: "query",
        },
      },
    };
  },
  methods: {
    async doGet() {
      const { response } = await get("/mock/get", { param: "mars-pro" }).done();
      this.httpResponse = response;
    },
    async doPost() {
      const { response } = await post("/mock/post", {
        param: "mars-pro",
      }).done();
      this.httpResponse1 = response;
    },
    async doPostForm() {
      const { response } = await get("/mock/postForm", {
        param: "mars-pro",
      }).done();
      this.httpResponse2 = response;
    },
    doHandle(command, e) {
      return new Promise((resolve) => {
        setTimeout(() => {
          resolve();
        }, 1000);
      });
    },
  },
  mounted() {
    console.log('------------');
    const ddd = window.location;
    if (window.location.search && window.location.search.indexOf("design") > -1) {
      this.page = "design";
    }
     if (window.location.search && window.location.search.indexOf("dev") > -1) {
      this.page = "dev";
    }
     if (window.location.search && window.location.search.indexOf("chart") > -1) {
      this.page = "chart";
    }
    if (window.location.search && window.location.search.indexOf("cascader-form") > -1) {
      this.page = "cascader-form";
    }
    if (window.location.search && window.location.search.indexOf("chart-g6") > -1) {
      this.page = "chart-g6";
    }
    if (window.location.search && window.location.search.indexOf("plot") > -1) {
      this.page = "plot";
    }
    
    
    this.ready = true;
  },
};
</script>
